<template>
	<view class="log-off-view">
		<view class="log-off-user fx-colum-center">
			<image :src="avtr" mode="aspectFill"></image>
			<view class="">{{nickName}}</view>
			<view class="log-off-title">账号注销提示</view>
		</view>
		<view class="log-off-tip">注销后，您的账户权益将受到如下影响：</view>
		<view class="log-off-content">
			<rich-text :nodes="content"></rich-text>
			<!-- <view class="">1.清空交易记录</view>
			<view class="desc">请确保所有交易已完结且无纠纷，账户注销后因历史交易可能产生的佣金、维权相关资金退回等权益将视为放弃</view>
			<view class="">1.清空交易记录</view>
			<view class="desc">请确保所有交易已完结且无纠纷，账户注销后因历史交易可能产生的佣金、维权相关资金退回等权益将视为放弃</view> -->
		</view>
		<view class="main-basic-btn">
			<view class="fx-center-center agreement-box" @click="checkedRadio=!checkedRadio">
				<radio :checked="checkedRadio" color="#4078E5" />
				<view class="">已阅读并同意<text @click.stop="toArtical">《注销须知》</text></view>
			</view>
			<van-button block color="#4078E5" @click="submit">注销账号</van-button>
		</view>
		<c-tip-dialog ref="tipRef" title="15天内存在录入新客资，无法注销"></c-tip-dialog>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				nickName: '',
				avtr: '',
				content: '',
				checkedRadio: false,
			};
		},
		onLoad() {
			this.getMyInfo()
			this.getDesc()
		},
		methods: {
			// 获取用户信息
			getMyInfo() {
				this.$api.requst('/gwc/user/me', {}).then(res => {
					this.nickName = res.data.nickname || res.data.mobile
					this.avtr = res.data.avatar
				})
			},
			// 注销提示
			async getDesc() {
				this.content = await this.$api.getArtical('user_delete_tip')
			},
			// 注销协议
			toArtical() {
				uni.navigateTo({
					url: '/pages/artical/artical?slug=user_delete_agreement'
				})
			},
			submit() {
				if (this.checkedRadio) {
					uni.showLoading({
						title: '数据提交中...'
					})
					this.$api.requst('/gwc/user/delete', {}, 'POST')
						.then((res) => {
							this.$api.showError('注销成功！')
							uni.clearStorageSync()
							this.$store.commit('loginChange', false);
							setTimeout(() => {
								uni.redirectTo({
									url: '/pages/mine/setup/logoff/logoffResult/logoffResult'
								})
							}, 1000)
						})
				} else {
					this.$api.showError('请先阅读相关协议')
				}
				// this.$refs.tipRef.show()

			}
		}
	}
</script>

<style scoped lang="scss">
	.log-off-view {
		.log-off-user {
			font-size: 26rpx;
			margin-top: 80rpx;

			image {
				width: 128rpx;
				height: 128rpx;
				border-radius: 50%;
				margin-bottom: 16rpx;
			}

			.log-off-title {
				font-weight: bold;
				font-size: 36rpx;
				margin-top: 34rpx;
			}
		}

		.log-off-tip {
			margin: 84rpx 24rpx 16rpx;
			font-size: 30rpx;
			color: #5C5F66;
		}

		.log-off-content {
			background: #FFFFFF;
			border-radius: 4rpx 4rpx 4rpx 4rpx;
			padding: 32rpx;
			font-size: 30rpx;
			font-weight: bold;
			margin: 0 24rpx;

			.desc {
				color: #5C5F66;
				font-weight: normal;
				margin: 16rpx 0 20rpx;
			}
		}

		.agreement-box {
			margin-bottom: 16rpx;
			font-size: 26rpx;

			radio {
				margin-right: 12rpx;
			}

			text {
				color: #4078E5;
			}
		}
	}
</style>